input[type='range'] {
  width: 100%;
  max-width: 513px;
  appearance: none;
  background: transparent;
}

input[type='range']::-webkit-slider-runnable-track {
  height: 10px;
  cursor: pointer;
  background: var(--accent);
  border-radius: 5px;
}

input[type='range']::-webkit-slider-thumb {
  height: 30px;
  width: 8px;
  border-radius: 10px;
  background: var(--text-default);
  cursor: pointer;
  appearance: none;
  margin-top: -10px;
}

.zoomHint {
  display: flex;
  justify-content: space-between;
  width: 103%;
  max-width: 522px;
}

.Accessibility .setting {
  display: grid;
}

.Accessibility label {
  justify-self: flex-start;
}

.Accessibility label,
.Accessibility span,
.Accessibility select,
.Accessibility option {
  font-size: var(--text-xl) !important;
}

.Accessibility .zoomHint span {
  font-size: var(--text-md);
}

.Accessibility .fonts-label {
  justify-self: flex-start;
}

.Accessibility .fonts-label button {
  width: auto;
  margin-inline-start: 1rem;
}

.Accessibility .fonts-label button:hover {
  color: var(--accent);
}

.Accessibility .fonts-label button.refreshing svg {
  color: var(--accent);
  animation: refreshing 2s 1;
}

.Accessibility h1.headerTitle {
  margin-inline-start: 0px;
}
